<script>
//this function to show review image when click review thumbnail button   - ThanhLD1
$(function(){
    $("#review").click(function(){
            var thumbnail = document.getElementById("thumbnail").value;
            if (thumbnail == ""){
				thumbnail = "http://www.weefmgrenada.com/images/na.jpg";
            }
            var title = document.getElementById("title").value;
            var body = $(".nicEdit-main").html();
            var nodeTitle = document.getElementById("showTitle");
            var nodeBody = document.getElementById("showBody");
            var nodeThumbnail = document.getElementById("showThumbnail");
            nodeTitle.innerHTML = title;
            nodeBody.innerHTML = body;
            nodeThumbnail.innerHTML = "<img src=\""+thumbnail+"\"class=\"img-thumbnail\"style=\"max-height: 200px; max-width: 200px;\"> ";
    });
});
</script>
<script src="http://js.nicedit.com/nicEdit-latest.js"
	type="text/javascript"></script>
<script type="text/javascript">bkLib.onDomLoaded(nicEditors.allTextAreas);</script>

<div class="panel panel-default">
	<div class="panel panel-heading">
		<table>
			<tr>
				<td><img class="img-edit" src="/img/addnew.png"></td>
				<td>
					<h1>
						<span class="text-custom">Add Post</span>
					</h1>
				</td>
			</tr>
		</table>
	</div>
	<div class="panel panel-body">
		<div class="col-md-12 col-md-offset-0">
			<form action="/adminposts/add" method="post"  enctype ='multipart/form-data'>
				<div class="form-group">
					<label>Title:</label>
					<div class="row">
						<div class="col-md-12">
							<input type="text" class="form-control" id="title" name="title"
								placeholder="Enter title" required="required" maxlength="50" />
						</div>
					</div>
				</div>
				<div class="form-group">
					<label>Body:</label>
					<div class="row">
						<div class="col-md-12">
							<textarea class="form-control" style="height: 300px;" name="body"
								id="body"></textarea>
						</div>
					</div>
				</div>
				<div class="form-group">
					<label>Thumbnail:</label>
					<div class="row">
						<div class="col-lg-12">
							<div class="input-group">
								<input type="text" class="form-control" id="thumbnail"
									name="thumbnail" placeholder="Your picture link!" /> <span
									class="input-group-btn">
									<button type="button" id="review"
										class="btn btn-default btnDel" data-toggle="modal"
										data-target="#myModal">Review</button>
								</span>

							</div>							
							<br />
						</div>
					</div>
					<input type="hidden" name="user_id"
						value="<?php $s = $this->Session->read('userLogin'); echo $s['User']['id'] ?>" />
					<div align="right" class="link-button">
						<button type="submit" class="btn btn-custom" style="width: 100px">Add
							Post</button>
						<a href="javascript: void(0);" onclick="window.history.back();"
							class="btn btn-custom" style="width: 100px">Back</a>
					</div>
				</div>
			</form>
		</div>
	</div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true">&times;</button>
				<h4 class="modal-title" id="myModalLabel">Review</h4>
			</div>
			<div class="modal-body">
				<div class="panel panel-default">
					<div class="panel-heading"><p style="word-wrap:break-word;"><h1 id="showTitle"></h1></p></div>
					<br/>
					<div align="center" id="showThumbnail"></div>
					<br/>
					<div class="panel-body" id="showBody"></div>
				</div>
			</div>
			<div class="modal-footer">
				<div class="btn-group btn-group-justified">
					<div class="btn-group">
						<button type="button" class="btn btn-custom" data-dismiss="modal">Close</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>